<div class="lx-select-selected-wrapper"
     ng-class="{ 'lx-select-selected-wrapper--with-filter': !lxSelectSelected.parentCtrl.ngDisabled && lxSelectSelected.parentCtrl.areChoicesOpened() && (lxSelectSelected.parentCtrl.multiple || !lxSelectSelected.parentCtrl.getSelectedModel()) }"
     id="lx-select-selected-wrapper-{{ lxSelectSelected.parentCtrl.uuid }}">
    <div class="lx-select-selected"
         ng-if="!lxSelectSelected.parentCtrl.multiple">
        <span class="lx-select-selected__value"
              ng-bind-html="lxSelectSelected.parentCtrl.displaySelected()"
              ng-if="lxSelectSelected.parentCtrl.getSelectedModel()"></span>

        <a class="lx-select-selected__clear"
           ng-click="lxSelectSelected.clearModel($event)"
           ng-if="lxSelectSelected.parentCtrl.allowClear && lxSelectSelected.parentCtrl.getSelectedModel()">
            <i class="mdi mdi-close-circle"></i>
        </a>
    </div>

    <div class="lx-select-selected" ng-if="lxSelectSelected.parentCtrl.multiple">
        <span class="lx-select-selected__tag"
              ng-class="{ 'lx-select-selected__tag--is-active': lxSelectSelected.parentCtrl.activeSelectedIndex === $index }"
              ng-click="lxSelectSelected.removeSelected(selected, $event)"
              ng-repeat="selected in lxSelectSelected.parentCtrl.getSelectedModel()"
              ng-bind-html="lxSelectSelected.parentCtrl.displaySelected(selected)"></span>

        <input type="text"
               placeholder="{{ ::lxSelectSelected.parentCtrl.label }}"
               class="lx-select-selected__filter"
               ng-model="lxSelectSelected.parentCtrl.filterModel"
               ng-change="lxSelectSelected.parentCtrl.updateFilter()"
               ng-keydown="lxSelectSelected.parentCtrl.keyEvent($event)"
               ng-if="lxSelectSelected.parentCtrl.autocomplete && !lxSelectSelected.parentCtrl.ngDisabled">
    </div>

    <lx-search-filter lx-dropdown-filter class="lx-select-selected__filter" ng-if="lxSelectSelected.parentCtrl.choicesViewMode === 'panes' && !lxSelectSelected.parentCtrl.ngDisabled && lxSelectSelected.parentCtrl.areChoicesOpened() && (lxSelectSelected.parentCtrl.multiple || !lxSelectSelected.parentCtrl.getSelectedModel())">
        <input type="text"
               ng-model="lxSelectSelected.parentCtrl.filterModel"
               ng-change="lxSelectSelected.parentCtrl.updateFilter()"
               lx-stop-propagation="click">
    </lx-search-filter>
</div>
